<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="shortcut icon" type="image/png" href="icon.png">

<title>iframe测试加载器</title>
</head>

<body style="background:#fff">

<div class="main">
	<div class="box"></div>
	<div class="reclog"></div>
</div>
<script>
function reclog(s,color){
	var now=new Date();
	var t=("0"+now.getHours()).substr(-2)
		+":"+("0"+now.getMinutes()).substr(-2)
		+":"+("0"+now.getSeconds()).substr(-2);
	var div=document.createElement("div");
	var elem=document.querySelector(".reclog");
	elem.insertBefore(div,elem.firstChild);
	div.innerHTML='<div style="color:'+(!color?"":color==1?"red":color==2?"#0b1":color)+'">['+t+']'+s+'</div>';
};
window.onerror=function(message, url, lineNo, columnNo, error){
	//https://www.cnblogs.com/xianyulaodi/p/6201829.html
	reclog('<span style="color:red">【Uncaught Error】'+message+'<pre>'+"at:"+lineNo+":"+columnNo+" url:"+url+"\n"+(error&&error.stack||"不能获得错误堆栈")+'</pre></span>');
};

reclog("IFrame测试，location: "+location.href.replace(/./g,function(a){return "&#"+a.charCodeAt(0)+";"})+' ，如果你点击了iframe中的任何链接，需点击一下此按钮（比如清除RecordApp注入的对象）：<button onclick="clearPage()">重置本页面环境</button>');
reclog('提示：`RecordApp测试`可以模拟跨域，跨域时未设置iframe相应策略H5录音权限永远是拒绝的（allow="camera;microphone"）<button onclick="setAllow(1)">重新打开网页并设置H5策略</button> <button onclick="setAllow()">清除H5策略</button>',2);
</script>

<script>
var clearPage=function(){
	window.NativeRecordReceivePCM=null;//干掉RecordApp Native注入到顶层的对象
	window.AppJsBridgeRequest=null;//干掉RecordApp示例配置Native注入到顶层的对象
	reclog("本页面环境已重置，已尝试清除RecordApp注入到本页面的对象");
};
var viewIframe=function(url,allow){
	document.querySelector(".box").innerHTML='<iframe src="'+url+'" '+(allow?'allow="camera;microphone"':'')+' class="iframe" style="width:98%;height:85vh; border:4px solid #0B1"></iframe>';
};

var iframeUrl=decodeURIComponent((/[?&#]iframeUrl=((https?(:|%3A)|\/)[^&#]+)/i.exec(location.href)||[])[1]||"");
console.log("iframeUrl: "+iframeUrl);
if(!iframeUrl){
	reclog('提供的iframeUrl参数无效',1);	
}else{
	iframeUrl=(iframeUrl[0]=="/"?"..":"")+iframeUrl;
	viewIframe(iframeUrl);
}

var setAllow=function(set){
	if(set){
		iframeUrl=prompt("iframe地址（可以跨域）",iframeUrl)||iframeUrl;
	};
	clearPage();
	
	viewIframe(iframeUrl,set);
	reclog(set?'已设置iframe的allow属性为"camera;microphone"':"已清除iframe的allow属性");
};
</script>

<script>
if(/mobile/i.test(navigator.userAgent)){
	//移动端加载控制台组件
	var elem=document.createElement("script");
	elem.setAttribute("type","text/javascript");
	elem.setAttribute("src","https://xiangyuecn.gitee.io/recorder/assets/ztest-vconsole.js");
	document.body.appendChild(elem);
	elem.onload=function(){
		new VConsole();
	};
};
</script>
</body>
</html>